﻿@{
    ViewBag.Title = "Index";
}
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>
    </title>

    <script type="text/javascript">
        $(function () {
            $(window).resize(function () {
                $('#grid_Users').datagrid('resize', {
                    width: $(window).width() - 10,
                    height: $(window).height() - 25
                }).datagrid('resize', {
                    width: $(window).width() - 10,
                    height: $(window).height() - 25
                });
            });

        });
        $(function () {
            initTable_Users();
            Add_Users();
            BindUpdate_Users();
            Delete_Users();
        }

            )
        function initTable_Users() {
            $("#grid_Users").datagrid({
                url: '/Users/GetAll',
                title: "Users管理",
                iconCls: 'icon-save',
                //width: function(){return document.body.clientWidth*0.9;},
                //height: 550,
                //fit:true,
                height: ($(window).height() * 0.98),
                nowrap: true,
                autoRowHeight: false,
                fitColumns: true,
                striped: true,
                collapsible: true,
                pagination: true,
                rownumbers: true,
                sortName: 'UID',
                sortOrder: 'desc',
                remoteSort: false,
                idField: 'UID',
                pageSize: 15,
                pageList: [15, 20, 30, 40, 50],
                striped: true, //奇偶行是否区分
                singleSelect: true,//单选模式
                rownumbers: true,//行号
                frozenColumns: [[
                    { title: 'UID', field: 'UID', width: 100, sortable: false },
          { title: 'UserName', field: 'UserName', width: 100, sortable: false },
          { title: 'UserPassword', field: 'UserPassword', width: 100, sortable: false },
          { title: 'DepartmentDID', field: 'DepartmentDID', width: 100, sortable: false },
          { title: 'Phone', field: 'Phone', width: 100, sortable: false },
          { title: 'Email', field: 'Email', width: 100, sortable: false },
          { title: 'QQ', field: 'QQ', width: 100, sortable: false },
          { title: 'NickName', field: 'NickName', width: 100, sortable: false },
          { title: 'Address', field: 'Address', width: 100, sortable: false },
          { title: 'RealName', field: 'RealName', width: 100, sortable: false },
          { title: 'Sex', field: 'Sex', width: 100, sortable: false },
          { title: 'LastLoginTime', field: 'LastLoginTime', width: 100, sortable: false },
          { title: 'CreateUserID', field: 'CreateUserID', width: 100, sortable: false },
          { title: 'CreateDate', field: 'CreateDate', width: 100, sortable: false },
          { title: 'IsVisible', field: 'IsVisible', width: 100, sortable: false },
                          ]],
                toolbar: [//工具栏
                    {
                        id: 'toolbar_btnAdd_Users',
                        text: '添加',
                        iconCls: 'icon-add',

                        handler: function () {
                            $('#DivAdd_Users').dialog('open');//直接弹出添加窗口
                        }
                    }, {
                        id: 'toolbar_btnCut_Users',
                        text: '修改',

                        iconCls: 'icon-cut',
                        handler: function () {
                            ShowUpdataDia_Users();//直接绑定弹出修改窗口事件
                        }
                    }, {
                        id: 'toolbar_btnDelete_Users',
                        text: '删除',
                        iconCls: 'icon-cancel',
                    }],
            }
          )
        }
        //添加事件
        function Add_Users() {
            $("#btnAdd_Users").click(function () {
               // alert('aaa');
                var validate = $("#formAdd_Users").form('validate');
                if (!validate ) {
                   // alert('aaaaaaa');
                    return false;
                }
                //获取参数传递给前台
                var postData = $("#formAdd_Users").serializeArray();
                alert(postData);
                //发送异步请求到后台保存用户数据
                $.post("/Users/Add", postData, function (data) {
                    if (data = "OK") {
                        //添加成功  1.关闭弹出层，2.刷新DataGird
                        $.messager.alert('提示消息', '添加成功!');
                        $("#DivAdd_Users").dialog("close");
                        $("#grid_Users").datagrid("reload");
                        $("#formAdd_Users").form("clear");
                    }
                    else {
                        $.messager.alert('提示消息', '添加失败!');
                    }
                });
            });
        }
        //弹出修改框
        function ShowUpdataDia_Users(browse) {
            var rows = $("#grid_Users").datagrid("getSelections");
            if (rows.length != 1) {
                $.messager.alert("友情提示", "每次只能修改/浏览一条，你已经选择了<font color='red'  size='6'>" + rows.length + "</font>条", "error");
                return;
            }
            if (browse == null) {
                //处理修改的信息，弹出修改的对话框,然后显示选择的用户的详细信息
                $("#DivUpdate_Users").dialog('open').dialog('setTitle', '修改信息');
                //绑定修改显示详细信息的方法

                BindShowUpdateInfo_Users();
            }
            else {
                //处理浏览的信息，弹出浏览狂，然后显示浏览信息的相信信息
                $("#DivBrowerUser").dialog('open').dialog('setTitle', '浏览信息');
                //绑定用户的浏览信息
                //BindBrowerUserInfo();
            }
        }
        //绑定弹出的修改界面
        function BindShowUpdateInfo_Users() {
            //首先用户发送一个异步请求去后台实现方法
            var mid = $("#grid_Users").datagrid("getSelections")[0].UID;  //获取到了用用户选择的ID
            $.get("/Users/GetInfo", { id: mid }, function (Info) {
                $('#ffUpdate_Users').form('load', Info);
            });
        }
        //修改
        function BindUpdate_Users() {
            $("#btnUpdate_Users").click(function () {
                //首先也是对用户进行检测
                var validate = $("#ffUpdateUsers").form("validate");
                if (validate == false) {
                    return false;
                }
                //构造参数发送给后台
                var posData = $("#ffUpdate_Users").serializeArray();
                $.post("/Users/Update", posData, function (date) {
                    if (date == "OK") {
                        //修改成功，关闭弹出层，刷新DataGird
                        $.messager.alert("友情提示", "修改成功");
                        $("#DivUpdate_Users").dialog('close');
                        $("#grid_Users").datagrid("reload");
                    }
                    else {
                        $.messager.alert("友情提示", "修改失败，请您检查");
                    }
                })
            });
        }

        //删除
        function Delete_Users() {
            $("#toolbar_btnDelete_Users").click(function () {
                var rows = $("#grid_Users").datagrid("getSelections");
                if (rows.length != 1) {
                    $.messager.alert("友情提示", "每次只能删除一条，你已经选择了<font color='red'  size='6'>" + rows.length + "</font>条", "error");
                    return;
                }
                $.messager.confirm("删除确认", "您确认删除?", function (r) {
                    if (r) {
                        var id = $("#grid_Users").datagrid("getSelections")[0].UID;
                        $.post("/Users/Delete", { id: id }, function (data) {
                            if (data == "OK") {
                                //修改成功，关闭弹出层，刷新DataGird
                                $.messager.alert("友情提示", "删除成功！" );
                                $("#DivUpdate_Users").dialog('close');
                                $("#grid_Users").datagrid("reload");
                            }
                            else {
                                $.messager.alert("友情提示", "删除失败：" + data);
                            }
                        })
                    }
                })
            });
        }
    </script>


</head>
<body>
    <div>
        <table id="grid_Users" style="width: auto;height:400px " title="用户操作" iconcls="icon-edit"></table>
    </div>
    <!--------------------------添加用户信息的弹出层---------------------------->

    <div id="DivAdd_Users" class="easyui-dialog" title="添加权限" style="width:580px;height:550px;padding:10px 20px"
         closed="true" resizable="true" modal="true" buttons="#dlg-buttons">

        <form id="formAdd_Users" method="post" novalidate="novalidate">
            <fieldset>
                <legend>添加信息</legend>
                <table id="tblAdd">
                   
                    <tr>
                        <td> <label for="UserName">UserName:</label></td>
                        <td><input type="text" name="UserName" style="width:184px" class="easyui-validatebox" data-options="required:true" /></td>
                    </tr>
                    <tr>
                        <td> <label for="UserPassword">UserPassword:</label></td>
                        <td><input type="password" name="UserPassword" style="width:184px" class="easyui-validatebox" data-options="required:true" /></td>
                    </tr>
                    <tr>
                        <td> <label for="DepartmentDID">DepartmentDID:</label></td>
                        <td><input type="text" name="DepartmentDID" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="Phone">Phone:</label></td>
                        <td><input type="text" name="Phone" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="Email">Email:</label></td>
                        <td><input type="text" name="Email" style="width:184px" class="easyui-validatebox" data-options="validType:'email'" /></td>
                    </tr>
                    <tr>
                        <td> <label for="QQ">QQ:</label></td>
                        <td><input type="text" name="QQ" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="NickName">NickName:</label></td>
                        <td><input type="text" name="NickName" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="Address">Address:</label></td>
                        <td><input type="text" name="Address" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="RealName">RealName:</label></td>
                        <td><input type="text" name="RealName" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="Sex">Sex:</label></td>
                        <td><input type="text" name="Sex" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="LastLoginTime">LastLoginTime:</label></td>
                        <td><input type="text" name="LastLoginTime" class="easyui-datebox" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="CreateUserID">CreateUserID:</label></td>
                        <td><input type="text" name="CreateUserID"   style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="CreateDate">CreateDate:</label></td>
                        <td><input type="text" name="CreateDate" class="easyui-datebox" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="IsVisible">IsVisible:</label></td>
                        <td><input type="checkbox" name="IsVisible"  value="true"/></td>
                    </tr>
                </table>
            </fieldset>
            <br />
            <a href="javascript:void(0)" class="easyui-linkbutton" id="btnAdd_Users" iconcls="icon-ok">新增</a>
            <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-cancel" onclick="javascript: $('#DivAdd_Users').dialog('close')">关闭</a>
        </form>
    </div>

    <div id="DivUpdate_Users" class="easyui-dialog" title="修改" style="width:580px;height:500px;padding:10px 20px"
         closed="true" resizable="true" modal="true" buttons="#dlg-buttons">

        <form id="ffUpdate_Users" method="post" novalidate="novalidate">
            <fieldset>
                <legend>修改</legend>
                <table id="tblUpdata">
                    
                    <tr>
                        <td> <label for="UserName">UserName:</label></td>
                        <td><input type="text" name="UserName" style="width:184px" class="easyui-validatebox" data-options="required:true" /><input type="hidden" name="UID"  /></td>
                    </tr>
                    <tr>
                        <td> <label for="UserPassword">UserPassword:</label></td>
                        <td><input type="password" name="UserPassword" style="width:184px" class="easyui-validatebox" data-options="required:true" /></td>
                    </tr>
                    <tr>
                        <td> <label for="DepartmentDID">DepartmentDID:</label></td>
                        <td><input type="text" name="DepartmentDID" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="Phone">Phone:</label></td>
                        <td><input type="text" name="Phone" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="Email">Email:</label></td>
                        <td><input type="text" name="Email" style="width:184px" class="easyui-validatebox" data-options="validType:'email'" /></td>
                    </tr>
                    <tr>
                        <td> <label for="QQ">QQ:</label></td>
                        <td><input type="text" name="QQ" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="NickName">NickName:</label></td>
                        <td><input type="text" name="NickName" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="Address">Address:</label></td>
                        <td><input type="text" name="Address" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="RealName">RealName:</label></td>
                        <td><input type="text" name="RealName" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="Sex">Sex:</label></td>
                        <td><input type="text" name="Sex" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="LastLoginTime">LastLoginTime:</label></td>
                        <td><input type="text" name="LastLoginTime" class="easyui-datebox" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="CreateUserID">CreateUserID:</label></td>
                        <td><input type="text" name="CreateUserID" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="CreateDate">CreateDate:</label></td>
                        <td><input type="text" name="CreateDate" class="easyui-datebox" style="width:184px" /></td>
                    </tr>
                    <tr>
                        <td> <label for="IsVisible">IsVisible:</label></td>
                        <td><input type="checkbox" name="IsVisible" value="true" /></td>
                    </tr>
                </table>
            </fieldset>
            <br />
            <a href="javascript:void(0)" class="easyui-linkbutton" id="btnUpdate_Users" iconcls="icon-ok">修改</a>
            <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-cancel" onclick="javascript: $('#DivUpdate_Users').dialog('close')">关闭</a>
        </form>
    </div>
</body>
</html>